import React, { ReactNode } from 'react'
import dayjs from 'dayjs'
import { Modal, Select ,Badge} from 'antd'
import { BaseListPage, IBaseListPageProps, IBaseListPageState, columnRenders, http, UdDatePicker } from '../../../lib'
import apis from "@/apis/Suggestions";
import { Moment } from 'moment';

const { Option } = Select

const DetailBtnAuth = 'customer_dealer_complaint_manager_find'
const DealwithBtnAuth = 'customer_dealer_complaint_manager_handle'

class DealWith extends BaseListPage<IDealWithProps, IDealWithState> {
  private statusEnum = {
    0: '待处理',
    1: '处理中',
    2: '已处理',
  }
  private statusOptions = Object.keys(this.statusEnum).map(key=>({value:key,title:this.statusEnum[key]}))
  constructor(props:IDealWithProps){
    super(props)
    this.state = {
      title: '投诉建议处理', 
      queryApi: apis.DealWithList,
      conditions: [
        { id: 'title', label: '反馈标题'},
        { id: 'agentCode', label: '客户编码'},
        { id: 'name', label: '客户名称'},
        { id: 'type', label: '类型', render:()=>(
          <Select>
            {this.state.suggestionTypes.map(({value,title})=><Option key={value} value={value}>{title}</Option>)}
          </Select>
        )},
        { id: 'startTime', label: '开始时间',
          render: <UdDatePicker format='YYYY-MM-DD' />
        },
        { id: 'endTime', label: '结束时间',
          render: <UdDatePicker format='YYYY-MM-DD' />
        },
        { id: 'status', label: '状态', render: (
          <Select>
            {this.statusOptions.map(({value,title})=><Option key={value} value={value}>{title}</Option>)}
          </Select>
        )
       },
      ],
      rowKey: 'id',
      columns: [
        { title: '反馈标题', dataIndex: 'feedbackTitle' },
        {
          title: '客户编码', dataIndex: 'agentCode',
        },
        {
          title: '客户名称',
          dataIndex: 'agentName',
        },
        {
          title: '反馈时间',
          dataIndex: 'createdTime',
        },
        {
          title: '类型',
          dataIndex: 'complaintTypeName',
        },
        { title: '状态', dataIndex: 'status', render: (text) => {
            return(
              <span>
                <Badge status={text===2?'success':'default'} />
                {this.statusEnum[text]}
             </span>
            )
          }
          
        },
        {
          title: '最近处理人',
          dataIndex: 'updatedBy',
        },
        {
          title: '最近处理时间',
          dataIndex: 'updatedTime',
          },
        {
          title: '操作',
          dataIndex: 'operation',
          fixedWidth: '90px',
          render: columnRenders.operate([
            {
              title: '处理', auth: DealwithBtnAuth, action: (text: any, record: any) => this.gotoDeal(record),
              show: (text: any, record: any) => {
                  return record.status!==2
              }
            },
            {
              title: '查看详情', auth: DetailBtnAuth, action: (text: any, record: any) => this.gotoDetail(record)
            },
          ])
        },
      ],
      suggestionTypes: [],
    }
  }
  private gotoDetail = (record) => {
   this.props.history.push('/Suggestions/DealWith/Detail/'+record.id)
  }
  private gotoDeal = (record) => {
   this.props.history.push('/Suggestions/DealWith/Deal/'+record.id)
  }

  componentDidMount() {
    super.componentDidMount()
    this.getDistributorList()
  }
  private getDistributorList() {
    http(apis.DealWithType).then(res => {
      const suggestionTypes = res.data?.map(({type:title,id:value})=>({value,title}))||[]
      this.setState({
        suggestionTypes,
      })
    })
  }
}


interface IDealWithProps extends IBaseListPageProps {

}

interface IDealWithState extends IBaseListPageState {
  suggestionTypes?:any
}

export default DealWith